<template>
	<view class="index">
		<view class="user-header padding-sm">
			<image src="../../static/image/userBg.png" mode="widthFix"/>
			<view class="nickName text-cut text-bold">高校定古高校定古迹官方及高校定古迹官方及高校定古迹官方及迹官方及</view>
			<view class="phone">15555555555</view>
		</view>
		<view class="cu-list menu padding-top-sm index-list margin-lr-sm"  v-for="i in 5">
			<view class="cu-item">
				<view class="content">
					<view class="text-bold padding-top-sm">补液单号 BY202411271320</view>
					<text class="text-sm">2024年11月1日  18:20:15</text>
				</view> 
				<view class="action">
					<view class="cu-btn radius text-df">皖A45124</view>
				</view>
			</view>
			<view class="flex justify-center text-center bg-white padding">
				<view class="flex-sub">
					<view class="text-blue text-bold text-xxl">113212</view>
					<view class="text-sm">补液总量(吨）</view>
				</view>
				<view class="flex-sub">
					<view class="text-blue text-bold text-xxl">11</view>
					<view class="text-sm">任务数量</view>
				</view>
			</view>
		</view>
	 </view>
</template>

<script>
export default {
	data() {
		return {
			order: null
		}
	},
	computed: {
		carinfo() {
			return this.$store.state.carinfo
		}
	},
	onShow() {
		this.init()
	},
	onPullDownRefresh() {
		this.init()
	},
	methods: {
		init() {
			this.$store.dispatch('getCarinfo')
			this.getOrderInfo()
		},
		gotoTaskList(item) {
			if(item.actualProcureCapacity) {
				uni.navigateTo({
					url: '/pages/index/task?orderId=' + item.id
				})
			} else {
				uni.navigateTo({
					url: '/pages/index/purchase?orderId=' + item.id
				})
			}
			
		},
		getOrderInfo() {
			this.$http({
				url: this.$api.systemUrl + 'fillstorageorder/getProcessingOrderOfCurrentUser',
				method: 'get',
				loading: 0
			}).then(res => {
				this.order = res.data
			})
		}
	}
}
</script>

<style lang="scss" >
	.user-header{
			position:relative;
			width:750rpx;
			height:200rpx;
			box-sizing: border-box;
			image{
				position:absolute;
				left:20rpx;
				top:20rpx;
				width:710rpx;
				height:160rpx;
			}
			.nickName {
				color: #ffffff;
				position:absolute;
				left:40rpx;
				top:50rpx;
				font-size: 34rpx;
				z-index:999;
				width:680rpx;
			}
			.phone {
				position:absolute;
				left:40rpx;
				top:100rpx;
				font-size: 24rpx;
				color: #ffffff;
				width: 190rpx;
				height: 34rpx;
				line-height: 34rpx;
				border-radius: 17rpx;
				margin-top: 10rpx;
				z-index:999;
			}
		} 
	
	.index{
		.index-list{
			margin-top:0;
			&.menu>.cu-item:after {
				border:none;
			}
			.text-sm{
				color:#7c7c7c;
			}
			.cu-btn{
				background-color: #D2D5DC;
				color:#303C52;
			}
		}
	} 
</style>